html{height:100%}
body{height:100%}
a{}

/*提示*/
.cnt-tips{ border: 1px solid #FFEAEA; background: #FFEAEA; padding: 5px 10px; margin-top: 10px;}
.cnt-tips p{ line-height:25px;}
.item{ display: inline-block;  margin:0.5% 0.5% 0 0; padding:2px 10px;  line-height: 30px; background-color:#FFEAEA; box-sizing: border-box;  }
.item.c20{width: 20%;}


.layout-wrap{ padding: 0px;background-color: #eee;  }
.layout{width:85%!important;max-width:85%!important; padding:20px!important; background-color: #eee; min-height:760px; }
.layout .left{ width:200px; position: absolute; background-color:#fff; }


.layout .right{ margin-left:210px;   line-height:28px; background-color:#fff; padding:15px; }
.layout .right h3{ font-size:16px; padding:5px 0px;}
.layout .right h3 .sub{ float:right}
.layout .right h3 .sub .field{ display:inline-block; margin-left:5px;}



/*概览*/
.box{ width:49%; float:left; padding:20px 20px; box-sizing:border-box; position:relative;}
.box.c3{ width:33%;}
.box.c4{ width:24%;}
.box .number{ font-size:18px; color:#0099cc}
.box .subtitle{ font-size:14px; margin-top:5px;}
.box .btn-group{ position:absolute; width:80px; top:20px; right:10px; text-align:right}
.box .btn-group a{display: block; margin-bottom: 5px;}
.box .s-row{ padding:5px 0px; border-bottom:1px dotted #eee;margin-left:40px;}
.box .s-row:last-child{ border-bottom:0px ;}
.box .s-row:hover{ background-color:#efefef;}
.box .s-row .key{ float:left; width:60px; position:relative;  }
.box .s-row .key i{ position:absolute; top:7px; left:-30px; font-size:16px; color:#0099cc}
.box .s-row .value{float:right; width:30px; text-align:right; padding-right:10px;}
.box .s-row .value a{ cursor:pointer}
.box .s-row .value .done{ color:#0C3}
.box .s-row .value .locked{ cursor:not-allowed; color:#0C3}



/*--个人信息--*/
.row-s{padding:5px 0px;}
.row{ padding:20px 0px; border-bottom:1px dotted #eee;margin-left:10px;}
.row:last-child{ border-bottom:0px ;}
.row:hover{ background-color:#efefef;}
.row .key{ float:left; width:30%; position:relative;  }
.row .key i{ position:absolute; top:7px; left:-50px; font-size:16px;}
.row .value{float:right; width:20%; text-align:right; padding-right:10px;}
.row .value a{ cursor:pointer}
.row .value .done{ color:#0C3}
.row .value .locked{ cursor:not-allowed; color:#0C3}


.form-inner{ width:60%;}

/*tab*/
.tab-group{ border-bottom:1px solid #eee;}
.tab-group .tab{ display: inline-block; border-top: 1px solid #EEEEEE; border-left: 1px solid #EEEEEE; border-right: 1px solid #EEEEEE; padding:5px 20px;cursor:pointer; background-color:#eee; color:#999; border-radius:3px 3px 0px 0px; }
.tab-group .active{ margin-bottom:-1px; background-color:#fff!important;color:#479add!important; }



/*筛选&操作*/
.filter{ float:left; margin-right:5px; width:200px;}
.search-wrapper{ padding:1%; border:1px #eee solid; margin-bottom:10px;}
.handle-wrapper{ padding:1%; border:1px #eee solid; margin-bottom:10px; width:47.5%; float:left;}
.handle-wrapper:nth-child(2){ float:right!important;}


/*充值*/
.charge{ border:1px solid #ccc; padding:5%; background-color:#f9f9f9}
.charge .result{ text-align:center; font-size:18px;padding:50px 0px;}
.charge .panel{ width:400px; margin:auto;}




@media screen and (max-width: 800px)  { /*当屏幕尺寸小于500px时，应用下面的CSS样式*/
.layout-wrap{ background-color:#fff; padding:0px; margin-top:50px;}
.layout{ width:auto; margin:0px auto; border:1px solid #eee; padding:10px; background-color:#FFFFFF }
.layout .left{ display:none;}
.layout .right{ width:auto; min-height:auto; float: none; margin-left:0px; padding:0px;}
.layout .right h3{ font-size:16px; padding:5px 0px;}
.layout .right h3 .sub{ float:inherit; margin-top:5px; }
.layout .right h3 .sub .field{ width:45%; margin-left:0px;}
.invalid{ text-align:center; padding:50px 0px;}
.invalid h1{ font-size:24px; display:block; color:#ff8a00;}
.invalid span{ margin-top:10px; display:block;}


.form-inner{ width:100%;}
/*提示*/
.cnt-tips{ border: 1px solid #FFEAEA; background: #FFEAEA; padding: 10px ; border-radius: 3px;margin-top: 0px;}
.cnt-tips p{ line-height:30px;}
.cnt-tips .item{ display: inline-block; width: 48%;  padding:2px 10px;  line-height: 30px; background-color:#ffcbcb; box-sizing: border-box;  }


.submit{ margin:0px auto; width:100%;  }


/*筛选*/
.filter{ float:left;  width:48.5%;}



/*概览*/
.box{ width:100%; float:left; padding:20px 20px; box-sizing:border-box; position:relative;}
.box.c3{ width:100%;}
.box.c4{ width:100%;}
.box .number{ font-size:28px; color:#0099cc}
.box .subtitle{ font-size:14px;}
.box .btn-group{ position:absolute; width:100px; top:30px; right:10px;}
.box .s-row{ padding:5px 0px; border-bottom:1px dotted #eee;margin-left:40px;}
.box .s-row:last-child{ border-bottom:0px ;}
.box .s-row:hover{ background-color:#efefef;}
.box .s-row .key{ float:left; width:60px; position:relative;  }
.box .s-row .key i{ position:absolute; top:7px; left:-30px; font-size:16px; color:#0099cc}
.box .s-row .value{float:right; width:30px; text-align:right; padding-right:10px;}
.box .s-row .value a{ cursor:pointer}
.box .s-row .value .done{ color:#0C3}
.box .s-row .value .locked{ cursor:not-allowed; color:#0C3}

.row{ padding:20px 0px; border-bottom:1px dotted #eee;margin-left:60px;}
/*充值*/
.charge{ border:1px solid #ccc; padding:5%; background-color:#f9f9f9}
.charge .result{ text-align:center; font-size:18px;padding:50px 0px;}
.charge .panel{ width:100%; margin:auto;}


.clasbut{min-width: 30px;color: #ffffff;
    background-color: #f0ad4e;
    border-color: #eea236;    -webkit-appearance: button;
    cursor: pointer;display: inline-block;
    margin-bottom: 0;
    font-weight: normal;
    text-align: center;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    background-image: none;
    border: 1px solid transparent;
    white-space: nowrap;
    padding: 8px 28px;
    font-size: 15px;
    line-height: 1.42857143;
    border-radius: 2px;
    -webkit-user-select: none;
}